import React from 'react';
import { Button, Divider, Form, Input } from 'antd';
import { Link } from 'react-router-dom';
import axios from '../../utils/http';
import RegisterWrap from './registerwrap';
//注册
const Register = () => {
  const [form] = Form.useForm();

  const register_click = async () => {
    const form_data = await form.validateFields();
    if (form_data) {
      axios.post('/api/register', form_data);
    }
  };
  return (
    <RegisterWrap>
      <Form form={form} className='register_form_wrap'>
        <h2>请注册</h2>
        <p>账号注册</p>
        <Form.Item
          name='username'
          rules={[{ required: true, message: '请输入用户名' }]}
          style={{ display: 'flex', justifyContent: 'center' }}
        >
          <Input type='text' placeholder='用户名' style={{ width: '250px' }} />
        </Form.Item>
        <Form.Item
          name='passworld'
          rules={[{ required: true, message: '请输入密码' }]}
          style={{ display: 'flex', justifyContent: 'center' }}
        >
          <Input type='text' placeholder='密码' style={{ width: '250px' }} />
        </Form.Item>
        <Button
          onClick={register_click}
          className='register_button'
          type='primary'
        >
          注册
        </Button>
        <Divider />
        <Link to='/login'>已有账号?直接登录</Link>
      </Form>
    </RegisterWrap>
  );
};

export default Register;
